<HTML>
<HEAD>
<TITLE>JavaScript Source Code 3000:  Calculators:  Miles per Gallon</TITLE>
<META HTTP-EQUIV="JavaScript Source Code 3000" CONTENT = "no-cache">
<META NAME="date" CONTENT="2000-09-09">
<META NAME="channel" CONTENT="Web Developer">
<META NAME="author" CONTENT="JavaScript Source Code 3000">
<META NAME="section" CONTENT="Calculators">
<META NAME="description" CONTENT="Computes the miles per gallon of your car via the miles traveled and the number of gallons used.  Also, if you enter the cost per gallon and how many miles you drive a day, it will estimate your monthly and yearly gas expenses.">

<SCRIPT LANGUAGE="JavaScript">
<!-- Cost estimate idea by Daniel C. Peterson -->




<!-- Begin
function compute(form) {
var milesPerMo = form.avgMiles.value *30.4;
var mpgcalc = (form.milesDriven.value / form.gallons.value) * 1;
var moGascalc = (((form.avgMiles.value * 30.4) / mpgcalc) * form.ppGal.value) * 1;
mpgcalc = twoDecs(mpgcalc);
moGascalc = twoDecs(moGascalc);
form.mpg.value = mpgcalc;
form.moGas.value = moGascalc;
form.yrGas.value = moGascalc * 12;
}
function twoDecs(item) {
return eval(parseInt(item * 100) * .01);
}
//  End -->
</script>
</HEAD>

<BODY BGCOLOR=#ffffff vlink=#0000ff>

<BR>
<center>
<table width=600 cellpadding=0 cellspacing=10>
<tr>
<td width=468 align=center>

    
    
</td>
<td width=120 align=center>
    
</td>
</tr>
</table>
<BR>
<BR>
<basefont size=3>
<FONT SIZE="+2" FACE="Helvetica,Arial">
<A HREF="../index.htm" /" TARGET="_top"><FONT COLOR="#0000FF"><b>Home</b></font></A>
<img src="../img/arrow.gif" /img/arrow.gif" height=13 width=7 border=0 alt="}">
<A HREF="index.htm" /calculators/"><font color="#FF0000"><b>Calculators</b></font></A>
<img src="../img/arrow.gif" /img/arrow.gif" height=13 width=7 border=0 alt="}">
<FONT COLOR="#006666"><b>Miles per Gallon</b></font></font>
<BR>
<BR>
<table BORDER=0 WIDTH=486 CELLPADDING=3 CELLSPACING=0>
<tr><td><font FACE="helvetica,arial,geneva">
<br>
<br>
<!-- Description --><!--content_start-->
Computes the miles per gallon of your car via the miles traveled and the number of gallons used.  Also, if you enter the cost per gallon and how many miles you drive a day, it will estimate your monthly and yearly gas expenses.
<hr>
</td></tr>
</table>
<!-- Demonstration -->
<center>
<form>
<table border=1>
<tr><td>Miles Driven: </td><td><input type=text name=milesDriven size=5> mi.</td></tr>
<tr><td>Gallons of Gas: </td><td><input type=text name=gallons size=5> gal</td></tr>
<tr><td>Cost per Gallon: </td><td>$ <input type=text name=ppGal size=5></td></tr>
<tr><td>Miles per Day: </td><td><input type=text name=avgMiles size=5></td></tr>
<tr><td colspan=2 align=center><input type=button value="Calculates To...." onClick="compute(this.form)"></td></tr>
<tr><td>~ <input type=text name=mpg size=7></td><td>Mi. per Gal.</td></tr>
<tr><td>$ <input type=text name=moGas size=7></td><td> per month</td></tr>
<tr><td>$ <input type=text name=yrGas size=7></td><td> per year</td></tr>
<tr>
<td colspan=2 align=center><input type=reset></td></tr>
</table>
</form>
</center>
<P>
<P>
<a name="source">
<table BORDER=0 WIDTH=486 CELLPADDING=3 CELLSPACING=0>
<tr><td BGCOLOR=yellow><font FACE="helvetica,arial,geneva"><b>JavaScript Source Code 3000:  Calculators:  Miles per Gallon</b>
<p>Simply click inside the window below, use your cursor to highlight the script, and copy (type Control-c or Apple-c) the script into a new file in your text editor (such as Note Pad or Simple Text) and save (Control-s or Apple-s).  The script is yours!!!
<br><br></font></td></tr>
<tr><td BGCOLOR=yellow ALIGN=CENTER>
<form NAME="copy">

<DIV align="center">
<input type=button value="Highlight All" onClick="javascript:this.form.txt.focus();this.form.txt.select();">&nbsp;&nbsp;&nbsp;&nbsp;
<INPUT TYPE="text" NAME="total" VALUE="Script Size:  1.86 KB" size=24>
</DIV>

<textarea NAME="txt" ROWS=20 COLS=75 WRAP=VIRTUAL>

&lt;!-- TWO STEPS TO INSTALL MILES PER GALLON:

  1.  Copy the coding into the HEAD of your HTML document
  2.  Add the last code into the BODY of your HTML document  --&gt;

&lt;!-- STEP ONE: Paste this code into the HEAD of your HTML document  --&gt;

&lt;HEAD&gt;

&lt;SCRIPT LANGUAGE="JavaScript"&gt;
&lt;!-- Cost estimate idea by Daniel C. Peterson --&gt;

&lt;! &gt;
&lt;! &gt;

&lt;!-- Begin
function compute(form) {
var milesPerMo = form.avgMiles.value *30.4;
var mpgcalc = (form.milesDriven.value / form.gallons.value) * 1;
var moGascalc = (((form.avgMiles.value * 30.4) / mpgcalc) * form.ppGal.value) * 1;
mpgcalc = twoDecs(mpgcalc);
moGascalc = twoDecs(moGascalc);
form.mpg.value = mpgcalc;
form.moGas.value = moGascalc;
form.yrGas.value = moGascalc * 12;
}
function twoDecs(item) {
return eval(parseInt(item * 100) * .01);
}
//  End --&gt;
&lt;/script&gt;
&lt;/HEAD&gt;

&lt;!-- STEP TWO: Copy this code into the BODY of your HTML document  --&gt;

&lt;BODY&gt;

&lt;center&gt;
&lt;form&gt;
&lt;table border=1&gt;
&lt;tr&gt;&lt;td&gt;Miles Driven: &lt;/td&gt;&lt;td&gt;&lt;input type=text name=milesDriven size=5&gt; mi.&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td&gt;Gallons of Gas: &lt;/td&gt;&lt;td&gt;&lt;input type=text name=gallons size=5&gt; gal&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td&gt;Cost per Gallon: &lt;/td&gt;&lt;td&gt;$ &lt;input type=text name=ppGal size=5&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td&gt;Miles per Day: &lt;/td&gt;&lt;td&gt;&lt;input type=text name=avgMiles size=5&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td colspan=2 align=center&gt;&lt;input type=button value="Calculates To...." onClick="compute(this.form)"&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td&gt;~ &lt;input type=text name=mpg size=7&gt;&lt;/td&gt;&lt;td&gt;Mi. per Gal.&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td&gt;$ &lt;input type=text name=moGas size=7&gt;&lt;/td&gt;&lt;td&gt; per month&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;&lt;td&gt;$ &lt;input type=text name=yrGas size=7&gt;&lt;/td&gt;&lt;td&gt; per year&lt;/td&gt;&lt;/tr&gt;
&lt;tr&gt;
&lt;td colspan=2 align=center&gt;&lt;input type=reset&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;/table&gt;
&lt;/form&gt;
&lt;/center&gt;

 

&lt;!-- Script Size:  1.86 KB --&gt;</textarea><br><font FACE="helvetica,arial,geneva"></font></td></tr>

</table>
</form>
</FONT>
</CENTER>


</center>
</body></html>
